<template>
  <div class="pingmianlunbo" >
    <el-carousel class="pingmianlunbo_swiper" :height="(module.height * 0.552) + 'px'" v-if="module.modules.length">
      <el-carousel-item v-for="(item, index) in module.modules" :key="index">
        <!-- <h3 class="small">{{ item }}</h3> -->
        <img class="image" :src="fileBaseUrl + item.pic" alt="" />
      </el-carousel-item>
    </el-carousel>
    <ModuleNotConfig  v-else  />
  </div>
</template>

<script>
export default {
  props: {
    module: {
      type: Object,
    },
    fileBaseUrl: {
      type: String,
    },
  }
};
</script>

<style lang="scss" scoped>
.pingmianlunbo_swiper {
  /deep/ .el-carousel__container {
    border-radius: 7px 20px 7px 20px;
    overflow: hidden;
  }
  /deep/ .el-carousel__indicator {
    &.is-active {
      .el-carousel__button {
        width: 27px;
        height: 7px;
        background: #000;
        opacity: 0.6;
        border-radius: 3.5px;
      }
    }
    .el-carousel__button {
      // margin: 0 8rpx;
      width: 8px;
      height: 8px;
      background: #000;
      opacity: 0.3;
      border-radius: 50%;
    }
  }
  .image {
      position: relative;
      top: 50%;
      transform: translateY(-50%);
      height: 359px;
    }
}
</style>
